<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-3.3.1.min.js"></script>
    <script>
        $(function () {
            $("button:contains('查询')").click(function () {
                var id = $(this).prev().val();
                if(id==null||id==""){
                    $.ajax({
                        type: "GET",
                        url: "users",
                        data: "",
                        dataType: "text",
                        success: function(msg){
                            alert(msg);
                        }
                    });
                }else{
                    $.ajax({
                        type: "GET",
                        url: "users/"+id,
                        data: "",
                        dataType: "text",
                        success: function(msg){
                            alert(msg);
                        }
                    });
                }
            });
            $("button:contains('添加/修改用户-POST')").click(function () {
                var id = $('#uid').val();
                if(id==null||id==""){
                    $.ajax({
                        type: "POST",
                        url: "users",
                        data: {username:$('#username').val(),password:$('#password').val(),name:$('#name').val()},
                        dataType: "text",
                        success: function(msg){
                            alert(msg);
                        }
                    });
                }else{
                    $.ajax({
                        type: "POST",
                        url: "users",
                        data: {id:id,username:$('#username').val(),password:$('#password').val(),name:$('#name').val()},
                        dataType: "text",
                        success: function(msg){
                            alert(msg);
                        }
                    });
                }
            });

            $("button:contains('删除用户')").click(function () {
                var id = $(this).prev().val();
                $.ajax({
                    type: "DELETE",
                    url: "users/"+id,
                    data: "",
                    dataType: "text",
                    success: function(msg){
                        alert(msg);
                    }
                });
            });

            $("button:contains('添加/修改用户-PUT')").click(function () {
                var id = $('#uid1').val();
                if(id==null||id==""){
                    $.ajax({
                        type: "PUT",
                        url: "users",
                        data: {username:$('#username1').val(),password:$('#password1').val(),name:$('#name1').val()},
                        dataType: "text",
                        success: function(msg){
                            alert(msg);
                        }
                    });
                }else{
                    $.ajax({
                        type: "PUT",
                        url: "users",
                        data: {id:id,username:$('#username1').val(),password:$('#password1').val(),name:$('#name1').val()},
                        dataType: "text",
                        success: function(msg){
                            alert(msg);
                        }
                    });
                }
            });
        })
    </script>
</head>
<body>
    id:<input type="text">
    <button>查询</button><br>

    id:<input type="text" id="uid">
    用户名:<input type="text" id="username">
    密码：<input type="text" id="password">
    真实姓名：<input type="text" id="name">
    <button>添加/修改用户-POST</button><br>

    id:<input type="text" >
    <button>删除用户</button><br>

    id:<input type="text" id="uid1">
    用户名:<input type="text" id="username1">
    密码：<input type="text" id="password1">
    真实姓名：<input type="text" id="name1">
    <button>添加/修改用户-PUT</button><br>
</body>
</html>